@import "../../style/color.scss";
@import "../../style/domain.scss";
@import "../../style/font.scss";

.page-container {
  width: $small-content-min-width;
  height: $small-content-min-height;
  background: url("../../../images/horizonImg/bg.png") no-repeat;
  margin: auto;
  position: relative;

  .back-btn.ant-btn {
    position: absolute;
    left: 50%;
    bottom: 55px;
    cursor: pointer;
    z-index: 9999;
    background: #1FC206;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.50);
    border-radius: 12px;
    width: 120px;
    height: 44px;
    line-height: 44px;
    transform: translateX(-50%);

    span {
      font-family: $regular-font-family;
      font-size: 20px;
      color: #FFFFFF;
      text-align: center;
    }
  }

  .page-wrapper {
    margin: 0 auto;
    width: 100%;
    height: 100%;


    .head-wrap {
      height: 153px;
      background: url("../../../images/horizonImg/home-top.png") no-repeat;
      padding: 10px;

      .logo {
        display: table-cell;
        vertical-align: top;
        width: 537px;
      }

      .header {
        display: table-cell;
        vertical-align: top;
        width: 100%;
        padding-left: 136px;
      }
    }

    .middle-content-wrap {
      width: 100%;
      margin-top: -10px;
      display: table;

      .side-wrapper {
        display: table-cell;
        vertical-align: top;
        width: 113px;
      }

      .page-wrap {
        display: table-cell;
        vertical-align: top;


        .page-content {
          margin-right: 87px;
        }
      }
    }
  }

  .bottom-img {
    height: 112px;
    position: absolute;
    bottom: 0;
    right: 0;
  }

  .buttom-logo {
    height: 65px;
    position: absolute;
    bottom: 11px;
    right: 80px;
  }
}

.v-page-container {
  min-width: $v-min-width;
 // min-height: $small-content-min-height;
  background: url("../../../images/vertical/bg.png") no-repeat;
  background-size: 100% 100%;
  margin: auto;
  position: relative;
  height: 100%;

  .v-back-btn.ant-btn,
  .v-back-btn.ant-btn:hover,
  .v-back-btn.ant-btn:focus{
    background: #F3FB69;
    border-color: #F3FB69;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.50);
    border-radius: 12px;
    width: 120px;
    height: 44px;
    line-height: 44px;
    position: absolute;
    left: 50%;
    bottom: 75px;
    cursor: pointer;
    z-index: 9999;
    transform: translateX(-50%);

    span {
      font-family: $regular-font-family;
      font-size: 22px;
      color: #3DD202;
      text-align: center;
    }
  }

  .v-page-wrapper {
    margin: 0 auto;
    width: 100%;
    height: 100%;

    .head-wrap {
      height: 172px;
      background: url("../../../images/vertical/top_border.png") no-repeat;
      background-size: 100% 172px;
      padding: 10px;

      .logo {
        display: table-cell;
        vertical-align: middle;
        width: 537px;
      }

      .header {
        display: table-cell;
        vertical-align: top;
        width: 100%;
        padding-right: 15px;
        text-align: right;
      }
    }

    .left-border {
      position: absolute;
      left:0;
    }

    .right-border {
      position: absolute;
      right:0;
    }

    .buttom-border {
      position: absolute;
      bottom:0;
      right:0;
    }

    .buttom-logo {
      position: absolute;
      bottom: 24px;
      right: 12px;
    }

    .v-page-content-wrap {
      margin: 0 80px 144px 81px;
      overflow: hidden;
    }
  }
}

.v-page-container {
  // 标题按钮
  .ant-btn.title-btn {
    padding-left: 20px;
    padding-right: 20px;
    height: 50px;
    border-radius: 25px;
    background-color: $title-font-color;
    border-color:$title-font-color;
    position: relative;
    top: -1px;
    left: -1px;

    & > span {
      font-family: $DFYuanW7-GBK;
      font-size: 20px;
      color: #FFFFFF;
      letter-spacing: 0;
      line-height: 30px;
    }

    &:hover, &:active, &:focus {
      background: $title-font-color;
      border-color:$title-font-color;
    }
  }

  //按钮的样式重写，长度宽度需要自己定义
  .ant-btn {

    font-family:$DFYuanW7-GBK;
    background-color: $btn-bg-color;
    letter-spacing: 0px;
    font-size:24px;
    height:50px;
    padding:0 30px;
    border-radius: 4px;
    border: 1px solid $btn-border-color;
    &[disabled], &[disabled]:focus, &[disabled]:hover {
      color: rgba(0, 0, 0, 0.25);
      background-color: #CCCCCC;
      border-color: #CCCCCC;
    }
    &:active, &:hover, &:focus {
      border: 1px solid $btn-border-color;
      background:$btn-border-color;
      color:$btn-border-color;
    }
    span{
      color:#fff;
    }
  }


  /**
* 覆盖antd组件样式---竖版
*/
  //搜索框
  .ant-input-search {
    width: 280px;
    height:34px;
    background: #FFFFFF;
    // border: 1px solid $page-border-color;
    border-radius: 0;

    >input {
      border-radius: 0;
      font-size: 18px;
    }

    .ant-input-search-icon {
      font-size: 18px;
    }
  }
  //表单的样式重写
  .ant-form{

    .ant-form-item{
      margin:20px 0;

      .ant-form-item-label{
        line-height:34px;
        vertical-align: top;
        height:34px;
      }

      .ant-form-item-label>label{
        font-family: $DFYuanW7-GBK;
        font-size: 18px;
        color: $form-font-color;
        letter-spacing: 0;

      }
      .ant-form-item-control-wrapper{
        display: inline-block;
      }

      .ant-input{
        border-radius: 0;
        height: 34px;
        width: 250px;
        font-family: $DFYuanW7-GBK;
        font-size: 18px;
        color: $form-font-color;
        letter-spacing: 0;

        &:hover,&:focus,&:active{
          border-color:$btn-border-color;
          box-shadow: none;
        }
      }
      .ant-select-selection-selected-value{
        font-family: $DFYuanW7-GBK;
        font-size: 18px;
        color: $form-font-color;
        letter-spacing: 0;
        line-height:34px;
      }

      .ant-select{
        width:250px;
      }

      .ant-select-selection{
        &:hover,&:focus{
          border-color:$btn-border-color;
          box-shadow: none;
        }
      }
      .ant-select-selection--single,.ant-select-selection__rendered{
        height:34px;
        border-radius:0;
      }
      .ant-select-selection__placeholder{
        font-size: 18px;
        height: 34px;
      }
    }

    .ant-form-item-required:before {
      content: '';
    }

    .has-success.has-feedback:after, .has-warning.has-feedback:after, .has-error.has-feedback:after, .is-validating.has-feedback:after {
      line-height: 34px;
      content: '';
    }

  }
  .ant-select-dropdown{
    border-radius:0;

    li{
      font-size: 18px;
    }

  }
  .ant-select-dropdown-menu-item-selected,
  .ant-select-dropdown-menu-item-selected:hover,
  .ant-select-dropdown-menu-item:hover{
    background: $un-select-color;
  }
  .ant-select-dropdown-menu-item-active {
    background:$btn-border-color ;
  }


  //模态框样式重置
  .ant-modal{
    .ant-modal-title{
      font-family: $DFYuanW7-GBK;
      font-size: 22px;
      color: $font-b-black;
      letter-spacing: 0;
      margin:12px 0

    }
    .ant-modal-footer{

      padding:18px 20px 18px 0;
      >button:first-child{
        background: #fff;
        margin-right:20px;
      }
    }
  }

  //单选框
  .ant-radio {
    vertical-align: top;
    //margin-top: 5px;
  }

  .ant-radio-wrapper:hover .ant-radio .ant-radio-inner,
  .ant-radio:hover .ant-radio-inner,
  .ant-radio .ant-radio-inner:hover {

    border-color: $pagination-a-color;
  }
  .ant-radio-wrapper .ant-radio .ant-radio-inner,
  .ant-radio .ant-radio-inner,
  .ant-radio .ant-radio-inner{

    border-color: $pagination-a-color;
    width: 38px;
    height: 38px;
    border-radius: 50%;
  }

  .ant-radio-checked .ant-radio-inner:after{

    background-color: $radio-check-color;
  }

  .ant-radio-inner:after{

    width: 24px;
    height: 24px;
    left: 6px;
    top: 6px;
    border-radius: 50%;
  }

  span.ant-radio + *{

    padding-left: 10px;
    padding-right: 10px;
  }

  //表格
  .ant-table-thead > tr > th {
    font-family: $DFYuanW7-GBK;
    font-size: 24px;
    color: $font-b-black;
    letter-spacing: 0;
  }
  .ant-table-bordered .ant-table-thead > tr > th {
    border-bottom: none;
    background-color: #EBF3E9;
  }
  .ant-table-body {
    border: solid 1px #cccccc;
  }
  .ant-table-tbody > tr > td {
    font-family: $DFYuanW7-GBK;
    height: 75px;
    color: $font-b-black;
    font-weight: normal;
    font-size: 24px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom-color: transparent;
    border-top:solid 1px #cccccc;
    background-color: #ffffff;
  }
  .ant-table-bordered .ant-table-thead > tr > th,
  .ant-table-bordered .ant-table-tbody > tr > td {
    border-right: solid 1px #cccccc;
  }
  .ant-table-bordered .ant-table-header > table,
  .ant-table-bordered .ant-table-body > table,
  .ant-table-bordered .ant-table-fixed-left table,
  .ant-table-bordered .ant-table-fixed-right table {
    border: none;
  }

  .ant-table-row:hover {
    cursor: pointer;
  }


  //页码
  .ant-pagination {
    display: inline-block;
  }
  .ant-pagination-prev,
  .ant-pagination-item,
  .ant-pagination-next{
    width: 34px;
    height:34px;
    line-height: 34px;
    border-radius: 0;
    background: #FFFFFF;
    // border: 1px solid #CCCCCC;
    margin: 0;
  }
  .ant-pagination-item a{
    font-family: $DFYuanW7-GBK;
    font-size: 20px;
    color: $pagination-a-color;
    letter-spacing: 0;
  }
  .ant-pagination-prev a:after,
  .ant-pagination-next a:after{
    line-height: 33px;
    height: 33px;
  }
  :root .ant-pagination-prev a:after, :root .ant-pagination-next a:after{
    font-size: $small-font-size;
    color: $pagination-a-color;
  }
  .ant-pagination-item-active {
    background: $item-active-color;
    border-color: $item-active-color;
    color: #ffffff;
    a{
      color: #ffffff;
    }
  }
  .ant-pagination-prev:not(.ant-pagination-disabled):hover,
  .ant-pagination-next:not(.ant-pagination-disabled):hover,
  .ant-pagination-item:not(.ant-pagination-disabled):hover {
    position: relative;
    z-index: 1000;
    border-color: $item-active-color;
    a {
      color: $item-active-color;
    }
  }
  .ant-pagination-item-active.ant-pagination-item-active:hover,
  .ant-pagination-item-active.ant-pagination-item-active:focus
  {
    background: $item-active-color;
    border-color: $item-active-color;
    color: white;

    a {
      color: #FFF;
    }
  }

  .ant-pagination-item:focus {
    border-color: $item-active-color;
  }
  .ant-pagination-prev .ant-pagination-item-link:after, .ant-pagination-next .ant-pagination-item-link:after {
    height: 32px;
    border: none;
    line-height: 33px;
  }
  .ant-pagination-prev .ant-pagination-item-link, .ant-pagination-next .ant-pagination-item-link {
    border-radius: 0;
  }

  //menu样式重置
  .ant-menu-inline .ant-menu-item,
  .ant-menu-inline .ant-menu-submenu-title {
    height:42px;
    line-height: 42px;
    //  background-color:$menu-normal-bgcolor;

    >span {
      font-family: $DFYuanW7-GBK;
      font-size: 20px;
      color: $font-b-black;
      letter-spacing: 0;
    }
  }

  .ant-menu-submenu-inline > .ant-menu-submenu-title:after:hover {
    font-size: $small-font-size;
  }

  .ant-menu-item:hover,
  .ant-menu-item-active,
  .ant-menu:not(.ant-menu-inline),
  .ant-menu-submenu-open,
  .ant-menu-submenu-active,
  .ant-menu-submenu-title:hover {
    background-color: transparent;
    color: #999999;
  }

  .ant-menu-root.ant-menu-vertical, .ant-menu-root.ant-menu-inline {
    // height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
  }
}
// 竖版modal
@media screen and (max-width: 1365px) {
  .ant-modal-wrap {
    top:25%;
  }
}
